    import React from 'react'
import "./Cate.less"

function Cate(props) {
    let arr = ['热门商品', '推荐商品', '全部商品', '分类'];
    let { n, setN, showList } = props
    return (
        <div className="list">
            <div className="list-nav">
                {
                    arr.map((item, index) => (
                        <div key={item} className={index === n ? 'select' : ''} onClick={() => setN(index)}>{item}</div>
                    ))
                }

            </div>
            {
                showList.map(item => (
                    <div className="lie">    
                            <img src={item.img} alt="" />
                   

                        <div key={item.id} className="right">
                             <p>&yen;{item.price}元</p>
                            {item.goodsname}
                        </div>
                    </div>
                ))
            }
        </div>
    )
}
export default React.memo(Cate)